<!doctype html>
<html lang="zh-CN">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<title>钢链网-找回密码</title>
	<link rel="stylesheet" href="/resource/css/gl_index.css">
	<link rel="stylesheet" href="/resource/css/gl_login.css">

	<script src="/resource/js/jquery-1.11.3.min.js"></script>
	<script src="/resource/js/gl_index.js"></script>
	<script>
		$(function(){

		});
	</script>
</head>
<body>
<div class="head">
    @include('common.user_head')
</div>
<div class="login-head">
	<div class="main-1200">
		<div class="logo">
			<a href="/"><img src="/resource/img/logo.png" alt=""></a>
			<span>找回密码</span>
		</div>
	</div>
</div>
<div class="bg">
	<div class="pass main-1200">
		<div class="pass-ul">
			<ul>
				<li class="active"><a href="javascript:;">输入手机号</a></li>
				<li><a href="javascript:;">输入新密码</a></li>
				<li><a href="javascript:;">完成</a></li>
			</ul>
		</div>
		<div class="pass-cont">
			<div class="cont">
				<div class="form">
					<form action="modify_pwd" method="post" onsubmit="return check_all()">
						<div class="form-group">
							<label for="">手机号</label>
							<input type="text" class="form-control" placeholder="请输入手机号码" id="mobile" name="mobile">
						</div>
						<div class="form-group form-code">
							<label for="">验证码</label>
							<input type="text" class="form-control"  name="captcha" id="captcha" onblur="check_captcha()" placeholder="请输入图形验证码">
							<div class="code-img">
								<img onclick="this.src='/captcha?'+ Math.random()" src="/captcha">
							</div>
							<span id="t_captcha">验证码错误</span>
						</div>
						<div class="form-group form-code">
							<label for="">短信验证码</label>
							<input type="text" class="form-control"  id="news_captcha" placeholder="请输入短信验证码">
							<button type="button" class="btn-code" id="f_captcha">获取验证码</button>
							<span id="t_news"></span>
						</div>
						<button type="submit" class="btn-login" onclick="check_news()">下一步</button>
					</form>
				</div>
			</div>
			<div class="cont">
				<div class="form">
					<form action="">
                        <input type="hidden" id="mobile_" value=""/>
						<div class="form-group">
							<label for="">新密码</label>
							<input type="password" class="form-control" placeholder="请输入6-18位密码" id='pwd' onblur="check_pwd()" name="password">
							<span id="t_pwd"></span>
						</div>
						<div class="form-group">
							<label for="">确认密码</label>
							<input type="password" class="form-control" placeholder="请输入6-18位密码" id="pwd1" onblur="check_pwd1()">
							<span id="t_pwd1">两次密码输入不一致，请重新输入 拷贝</span>
						</div>
						<button type="button" class="btn-login" onclick="update_pass()">下一步</button>
					</form>
				</div>
			</div>
			<div class="cont">
				<div class="succ">
					<div class="in">
						<img src="/resource/img/gl_show_succ.png" alt="">
						重置密码成功
					</div>
					<div class="a">
						<a href="/login">去登录</a>
						<div class="go-lo"><span>5s</span>后自动跳转至登录页</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
@include('common.shop_foot')
</body>
</html>
<script>
    function check_captcha(){
        var captcha =  document.getElementById('captcha').value;
        var status = false;
        if(captcha){
            var ajax = new XMLHttpRequest();
            ajax.onreadystatechange = function () {
                if (ajax.readyState == 4) {
                    if (ajax.responseText == 1) {
                        $("#t_captcha").hide();
                        status = true
                    } else {
                        $("#t_captcha").show();
                    }
                }
            }
            //与服务器建立连接
            ajax.open('post', '/js_verify_register', false);
            ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
            //处理请求
            ajax.send('captcha=' + captcha);
            return status
        }else{
            return false;
        }
    }
    //短信验证
    function check_news(){
        var news_captcha = document.getElementById('news_captcha').value;
        var mobile = document.getElementById('mobile').value;
        $("#t_news").show();
        var status = false;
        if(news_captcha){
            var ajax = new XMLHttpRequest();
            ajax.onreadystatechange = function () {
                if (ajax.readyState == 4) {
                    if (ajax.responseText == 1) {
                        $("#t_news").hide();
                        $('.pass-cont .cont').hide().eq(1).show();
                        $('.pass-ul li').eq(1).addClass('active').siblings().removeClass('active');
                        $('#mobile_').val(mobile);
                        status = true
                    }else if(ajax.responseText == 2){
                        $("#t_news").html("验证码已过期");
                    }else{
                        $("#t_news").html("验证码错误");
                    }
                }
            }
            //与服务器建立连接
            ajax.open('post', '/js_verify_register', false);
            ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
            //处理请求
            ajax.send('news_captcha=' + news_captcha + '&mobile=' +mobile);
            return status
        }else{
            document.getElementById('t_news').innerHTML = "<span style='color:red'>*</span>";
            return false;
        }

    }
    //获取短信验证码

    $('#f_captcha').bind('click',function foo(){
        var mobile = document.getElementById('mobile').value;
        var reg = /^1[34578]\d{9}$/;
        $("#t_news").show();
        if(reg.test(mobile)) {
            if(check_captcha()) {
                var wait = 60;
                var int = function fetch_captcha() {
                    if (wait == 0) {
                        $("#f_captcha").bind("click", foo);
                        $('#f_captcha').html('获取验证码').addClass('btn-code-zeor');
                        clearInterval(a)
                        wait = 60;
                    }
                    else {
                        $('#f_captcha').unbind("click", foo);
                        $('#f_captcha').html("重新发送(" + wait + ")").removeClass('btn-code-zeor');
                        wait--;
                    }
                }
                var a = setInterval(int, 1000);
                $.ajax({
                    url: "/verify_news",
                    type: "POST",
                    data: "mobile=" + mobile,
                    success: function (msg) {
                        if (msg == 10000) {
                            $("#t_news").html("验证码发送成功,10分钟内输入有效");
                        }else if(msg == 160040){
                            $("#t_news").html("您当日验证码发送次数过多");
                            window.clearInterval(a);//停止计时器
                            $(".form-code span.code").removeAttr("disabled").css('cursor','pointer');//启用按钮
                            $(".form-code span.code").html("获取短信验证码");
                            return false;
                        }else{
                            $("#t_news").html("验证码发送错误");
                            window.clearInterval(a);//停止计时器
                            $(".form-code span.code").removeAttr("disabled").css('cursor','pointer');//启用按钮
                            $(".form-code span.code").html("获取短信验证码");
                            return false;
                        }
                    }
                });
            }else{
                $("#t_captcha").show();
                return false
            }
        }else{
            $("#t_news").html("请输入正确的手机号");
            return false
        }
    })

    //验证密码
    function check_pwd(){
        var pwd = $('#pwd').val();
        var reg=/^\w{6,16}$/;
        if(pwd){
            if(reg.test(pwd)) {
                $("#t_pwd").hide();
                return true
            }else{
                $("#t_pwd").show();
                $("#t_pwd").html("密码长度六位到十六位");
                return false
            }
        }else{
            $("#t_pwd").show();
            return false
        }
    }

    //验证新密码
    function check_pwd1(){
        var pwd  = $('#pwd').val();
        var pwd1 = $('#pwd1').val();
        if(pwd == pwd1){
            $("#t_pwd1").hide();
            return true
        }else{
            $("#t_pwd1").show();
            return false
        }
    }

    //修改密码
    function update_pass(){
        var pwd    = $('#pwd').val();
        var mobile = $('#mobile_').val();
        $.ajax({
            url: "/modify_pwd",
            type: "post",
            data: 'password='+pwd+'&mobile='+mobile,
            async: false,
            success: function (msg) {
                if(msg==1){
                    $('.pass-cont .cont').hide().eq(2).show();
                    $('.pass-ul li').eq(2).addClass('active').siblings().removeClass('active');
                    var sutime = 5 ;
                    successTime(sutime);
                }
            }
        })
    }

    function successTime(sutime){

        window.setInterval(function(){
            $('.go-lo span').html(sutime + 'S');
            if (sutime == 0) {
                window.location.href = "/login" ;
            };
            sutime--;
        },1000);

    };


    //检测全部
    function check_all(){
        return (check_pwd()&&check_news()&&check_pwd1())
    }
</script>